define(
	[
		'require',
		'echarts',
		'echarts/chart/line',
		'zrender/tool/util',
		'apm/ui/business_chart_base'
	],
	function (require) {
		"use strict";

		var echarts = require('echarts');
		var zrUtil = require('zrender/tool/util');

		var forEach = Ember.EnumerableUtils.forEach;
		var baseObject = {
			type: 'bar',
			barMaxWidth: 30,
	
			itemStyle: {
				normal: {
					barBorderRadius: 0,
					color: function(params) {
						// build a color map as your need.
						var colorList = [
						  '#81f26f','#03afff','#DA70D6','#32CD32','#6495ED',
						   '#FF69B4','#9BCA63','#FAD860','#F3A43B','#60C0DD',
						   '#D7504B','#C6E579','#F4E001','#F0805A','#26C0C0'
						];
						return colorList[params.dataIndex%2];
					},
					label: {
						show: false,
						position: 'top',
						formatter: '{c}'
					}
				}
			},
			data:[],
		};

		var Component = require("apm/ui/business_chart_base").extend({
			_getDefaultOption: function(){
				return {
					tooltip: {
						trigger: 'item'
					},
					grid: {
						x: 60,
						y: 40,
						x2: 10,
						y2: 30,
						borderWidth: 1,
						borderColor:"#215b92"
					},
					xAxis: [
						{
							type: 'category',
							boundaryGap : [10,10],
							axisTick : {
								show : false
							},
							axisLine: {
								show : false,
								lineStyle: {
									color:"#215b92"
								}
							},
							splitLine: {
								show: true,
								lineStyle: {
									color:"#1f5992"
								},
							},
							axisLabel : {
								show : true,
								interval : 0,
								rotate : 0,
								textStyle: {
									color: "#5592c9"
								}
							},
							splitNumber:6,
							data: ['Line', 'Bar', 'Scatter', 'K', 'Pie']
						},

					],
					yAxis: [
						{
							type: 'value',
					
							axisLine: {
								show : false,
								lineStyle: {
									color:"#215b92"
								}
							},
							splitLine: {
								show: true,
								lineStyle: {
									color:"#1f5992"
								},
							},
							splitNumber:6,
							axisLabel : {
								show : true,
								textStyle: {
									color: "#5592c9"
								}
							},
						}
					],

					series: [
						
					]					
				};
			},

			_translateOption: function(option){
				this._translateXAxis(option);
				this._translateSeries(option);
				this._translateOther(option);
				this._setFormatter(option);
			},

			_translateXAxis: function(option){
				var view = this;
				var data = this.get("data")||[];
				var xAxisData = option.xAxis[0].data = [];
				forEach(data, function(performance){
					xAxisData.push(view._translateXAxisDataItem(performance));
				});

				if(xAxisData.length == 0){
					xAxisData.push("-");
				}
			},

			_translateSeries: function(option){
				var newObject = Ember.copy(baseObject, true);
				option.series.push(newObject);
					
				var view = this;
				var data = this.get("data")||[];
				var seriesData = option.series[0].data;
				forEach(data, function(performance){
					if(overviewOrCenterSwitch == "business"){
						if(view.get("businessDataKey")){
							seriesData.push(view._translateSeriesDataItem(performance[view.get("businessDataKey")]));
						}else{
							seriesData.push(view._translateSeriesDataItem(performance[view.get("dataKey")]));
						}
					}else{
						seriesData.push(view._translateSeriesDataItem(performance[view.get("dataKey")]));
					}
				});
			},

			_translateOther: function(option){
				option.yAxis[0].name = this.get("yName")||"";
				if(this.get("yMax")) {
					option.yAxis[0].max = this.get("yMax");
				}

				if(!this.hasData){
					option.yAxis[0].max = 100;
				}

				if(this.dataKey && this.dataKey == "system/score/apdex"){
					option.yAxis[0].splitNumber = 1;
				}
			},

			_setFormatter: function(option){
				var fmtType = this.get("fmtType");
				if(typeof fmtType == "undefined" && this.dataKey == "system/response_time/avg"){
					fmtType = "transform_time";						
				}
				function formate(tmp,value){
					forEach(value,function(param){
						forEach(param.data,function(v){
							if(v.value != "-"){
								tmp.push(v.value);
							}
						})
					});
					return Math.max.apply(null,tmp);
				}

				if(fmtType == "transform_time"){
					var tmp = [];//最大值
					var T = "ms";
					var Max = formate(tmp,option.series);
					if(1e3 > (Max / 1e3)){
						
					}else if(6e4 > (Max / 1e3)){
						T = "s";
					}else if (36e5 > (Max / 1e3)){
						T = "m";
					}else{
						T = "h";
					}
					option.yAxis[0].axisLabel.formatter = APM.util.indicatorFormatter_y(fmtType,T);
				}else if(fmtType == "transform_flow_mb"){
					var tmp = [];
					var T = "KB";
					var Max = formate(tmp,option.series);
					if(1e3 > (Max / 1e3)){
						
					}else if(1e6 > (Max / 1e3)){
						T = "MB";
					}else if (1e9 > (Max / 1e3)){
						T = "GB";
					}else{
						T = "TB";
					}
					option.yAxis[0].axisLabel.formatter = APM.util.indicatorFormatter_y(fmtType,T);
				}else if(fmtType == "transform_flow_kb"){
					var tmp = [];
					var T = "KB";
					var Max = formate(tmp,option.series);
					if(1e3 > (Max / 1e3)){
						
					}else if(1e6 > (Max / 1e3)){
						T = "MB";
					}else if (1e9 > (Max / 1e3)){
						T = "GB";
					}else{
						T = "TB";
					}
				}else if(fmtType == "transform_flow_bps"){
					var tmp = [];
					var T = "bps";
					var Max = formate(tmp,option.series);
					if(1e3 > Max ){
						
					}else if(1e3 > (Max / 1e3)){
						T = "Kbps";
					}else if (1e6 > (Max / 1e3)){
						T = "Mbps";
					}else{
						T = "Gbps";
					}
				}else{
					option.yAxis[0].axisLabel.formatter = APM.util.indicatorFormatter(fmtType);
				}
				option.tooltip.formatter = this._tooltipFormatter(fmtType);
			},

			/**
			 * 将原始值转换为柱形图的xAxis配置
			 */
			_translateXAxisDataItem: function(performance){
				return performance.name;
			},

			_translateSeriesDataItem: function(orgiVal){
				var value = Ember.isNone(orgiVal) ? "-" : orgiVal;

				if(value !== "-"){
					this.hasData = true;
				}

				return {value :value,
						orgiVal:orgiVal
					};
			},

			_tooltipFormatter: function(type){
				return function(params, ticket, callback){
					params = Ember.A(params||[]);
					var formatter = APM.util.indicatorFormatter(type);
					var tooltip = params[1] + '：' + formatter(params[2]);
					return tooltip;
				}
			},

			_resizeChart: function(){
				this.updateAxisLabelInterval();
				this._super();
			}
		});

		APM.ui.BrowserBar = Component;

		return Component;
	}
);